<template>
  <el-header class="cf">
      <!--logo-->
      <div class="logo fl">
          <img src="/img/logo/logo.png" alt="" />
      </div>

      <!--用户信息、用户权限-->
      <div class="user-info fr">
          <el-dropdown>
              <span class="el-dropdown-link">
                超级管理员 <i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item>修改密码</el-dropdown-item>
                  <el-dropdown-item>退出</el-dropdown-item>
              </el-dropdown-menu>
          </el-dropdown>
      </div>
  </el-header>
</template>

<script>
import Vue from 'vue'
import {
    Header,
    Dropdown,
    DropdownMenu,
    DropdownItem } from 'element-ui'
Vue.use(Header)
Vue.use(Dropdown)
Vue.use(DropdownMenu)
Vue.use(DropdownItem)

export default {
    name: 'index'
}
</script>

<style lang="scss" scoped>
    .el-header{
        background-color: #E17A0B;
        color: #333;
        text-align: center;
        line-height: 60px;
    }

    .el-dropdown-link{
        color:#fff;
    }
</style>
